<template>
  <div class="pop">
    <div class="pop-box list">
      <div class="pop-close" @click="this.close"></div>
      <div class="content">
        <div class="orderItem" style="border-bottom:none;margin-top:0;">
          <div class="ordericon">
            <div class="image" :style="`background-image:url(${user.headimgurl});`"></div>
          </div>
          <div class="orderinfo" style="padding-top:0;">
            <div class="">
              {{user.nickname}}
            </div>
            <div class="small">最高分: {{user.score}}分</div>
            <div class="small">距离第一名{{user.distance}}分</div>
          </div>
        </div>
        <div class="pop-list">
          <div class="pop-list-title">
            总积分排名
            <span @click="this.list">全部排名>></span>
          </div>
          <div class="orderList touchmove_enable" style="height:4.8rem;">
            <div v-for="user in allUserInfo.topTree" :key="user.id" class="orderItem">
              <div class="ordericon">
                <div class="image" :style="`background-image:url(${user.headimgurl});`"></div>
              </div>
              <div class="orderinfo">
                <div class="">
                  {{user.nickname}}
                  <span class="small">{{user.score}}分</span>
                </div>
                <div class="small">17600717350</div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="button-box">
        <div class="tbutton start" @click="this.clickStart"></div>
        <div class="tbutton share" @click="this.clickShare"></div>
      </div>
    </div>
    <div class="pop-shadow"></div>
  </div>
</template>
<script>
import banTouchMove from "../../../util/banTouchmove";
export default {
  name: "TipPop",
  props: ["user", "allUserInfo"],
  mounted() {
    banTouchMove();
  },
  methods: {
    clickStart() {
      this.$emit("clickStart");
    },
    clickShare() {
      this.$emit("clickShare");
    },
    close() {
      this.$emit("close");
    },
    list() {
      this.$router.push("rushOrder");
    }
  }
};
</script>